<template>
  <div class="mod-user">
    <el-card class="box-card" style="width:80%;margin:0 auto;">
      <el-form
        :model="dataForm"
        :rules="rules"
        ref="dataForm"
        label-width="100px"
        class="demo-ruleForm"
      >
        <el-form-item label="商品分类" prop="type">
          <el-select v-model="dataForm.type">
            <el-option
              v-for="item in transferTypes"
              :label="item.typeTitle"
              :key="item.type"
              :value="item.type"
            />
          </el-select>
        </el-form-item>
        <el-form-item label="商品名称" prop="memberName">
          <el-input v-model="dataForm.memberName" />
        </el-form-item>
        <el-form-item label="副标题" prop="num">
          <el-input type="password" v-model="dataForm.num" />
        </el-form-item>
        <el-form-item label="商品货号" prop="realName">
          <el-input v-model="dataForm.realName" />
        </el-form-item>
        <el-form-item label="商品售价" prop="realName">
          <el-input v-model="dataForm.realName" />
        </el-form-item>
        <el-form-item label="计量单位" prop="realName">
          <el-input v-model="dataForm.realName" />
        </el-form-item>
        <el-switch v-model="value1"  inactive-text="商品上架"></el-switch>
      </el-form>
           <!-- 订单列表数据 -->
      <el-table :data="orderlist" border stripe>
        <el-table-column type="index"></el-table-column>
        <el-table-column label="订单编号" prop="order_number"></el-table-column>
        <el-table-column label="订单价格" prop="order_price"></el-table-column>
        <el-table-column label="是否付款" prop="pay_status">
          <template slot-scope="scope">
            <el-tag type="success" v-if="scope.row.pay_status === '1'">已付款</el-tag>
            <el-tag type="danger" v-else>未付款</el-tag>
          </template>
        </el-table-column>
        <el-table-column label="是否发货" prop="is_send">
          <template slot-scope="scope">
            <template>
              {{scope.row.is_send}}
            </template>
          </template>
        </el-table-column>
        <el-table-column label="下单时间" prop="create_time">
          <template slot-scope="scope">
            {{scope.row.create_time | dateFormat}}
          </template>
        </el-table-column>
        <el-table-column label="操作">
          <template>
            <el-button size="mini" type="primary" icon="el-icon-edit" @click="showBox"></el-button>
            <el-button size="mini" type="success" icon="el-icon-location" @click="showProgressBox"></el-button>
          </template>

        </el-table-column>
      </el-table>
        <el-checkbox-group v-model="checkList">
    <el-checkbox label="复选框 A"></el-checkbox>
    <el-checkbox label="复选框 B"></el-checkbox>

  </el-checkbox-group>
    </el-card>
  </div>
</template>

<script>
export default {
  data () {
    return {
      checkList: ['选中且禁用', '复选框 A'],
      value1: true,
      value2: true,
      transferTypes: [
        { type: 1, typeTitle: '芒果' },
        { type: 2, typeTitle: '种子' }
      ],
      dataForm: {
        type: 1,
        memberName: '',
        num: '',
        password: ''
      },
      rules: {
        type: [{ required: true, message: '请选择转账类型', trigger: 'blur' }],
        memberName: [
          { required: true, message: '请输入收款用户名', trigger: 'blur' }
        ],
        num: [{ required: true, message: '转出数额不能为空', trigger: 'blur' }],
        password: [
          { required: true, message: '请输入您的二级密码', trigger: 'blur' }
        ]
      }
    }
  },
  methods: {
    transfer () {
      this.$refs['dataForm'].validate(valid => {
        if (valid) {
          this.$http({
            url: this.$http.adornUrl('/transfer'),
            method: 'post',
            data: this.$http.adornData({
              type: this.dataForm.type,
              memberName: this.dataForm.memberName,
              num: this.dataForm.num,
              password: this.dataForm.password
            })
          }).then(({ data }) => {
            if (data && data.status === 200) {
              this.$message.success(data.message)
            } else {
              this.$message.error(data.message)
            }
          })
        }
      })
    }
  }
}
</script>
<style >
.el-card__body {
  width: 100%;
}
</style>
